$height-description: 120;
$padding-description-left-right: 12rpx;
$padding-description: 0 $padding-description-left-right;
$background-color-cell: #f5f5f6;
$color-cell-number: #ff0000b8;

.date-item {
  width: 320rpx;
  height: 320rpx;
  box-sizing: border-box;
  border-radius: 10px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: relative;
  border: 1px solid $background-color-cell;
  margin-bottom: 36rpx;
  transition: all 1s;

  .item-content {
    width: 100%;
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 44px;
    background: $background-color-cell;
    color: $color-cell-number;
  }
  .item-content-set {
    font-size: 12px;
    color: #6494ed;
    cursor: pointer;
  }

  .item-content-day-money,
  .item-content-hoilday-balance {
    font-size: 32px;
    background: radial-gradient(at left top, #6494ed6b, #f5f5f6, #fff);
    // background: radial-gradient(at right bottom, #6494ed6b, #f5f5f6, #fff);
    // background: repeating-radial-gradient(circle at 50% 50%, #f5f5f6 , #f5f5f6 20px,#fff 20px, #fff 40px, #6494ed6b 40px, #6494ed6b 60px);
  }

  .item-content-month-money,
  .item-content-lieu-balance {
    font-size: 28px;
    font-weight: 540;
    background: radial-gradient(at right top, #6494ed6b, #f5f5f6, #fff);
    // background: radial-gradient(at left bottom, #6494ed6b, #f5f5f6, #fff);
  }

  .item-content-salary {
    font-size: 28px;
    font-weight: 540;
    background: radial-gradient(at left bottom, #6494ed6b, #f5f5f6, #fff);
    // background: radial-gradient(at right top, #6494ed6b, #f5f5f6, #fff);
  }

  .item-content-hoilday {
    font-size: 28px;
    font-weight: 540;
    background: radial-gradient(at right bottom, #6494ed6b, #f5f5f6, #fff);
    // background: radial-gradient(at left top, #6494ed6b , #f5f5f6, #fff);
  }

  .item-description {
    height: $height-description * 1rpx;
    line-height: $height-description * 1rpx;
    font-size: 14px;
    width: 100%;
    color: #111;
    font-family: Hannotate SC;
  }

  .item-description-title {
    padding: 6rpx $padding-description-left-right 0 $padding-description-left-right;
    height: $height-description / 2 * 1rpx - 6rpx;
    line-height: $height-description / 2 * 1rpx - 6rpx;
    font-size: 14px;
  }

  .item-description-text {
    padding: $padding-description;
    height: ($height-description / 2 - 12) * 1rpx;
    margin-bottom: 12rpx;
    display: flex;
    align-items: center;

    .item-description-text-icon {
      height: 36rpx;
      width: 36rpx;
    }

    .item-description-text-title {
      font-size: 13px;
      margin-left: 12rpx;
    }
  }
}

.date-item-shadow {
  box-shadow: 0px -16px 10px 0px rgba(0, 0, 0, 0.5);
  perspective: 200px;
  transform: rotateX(12deg);
  // box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5)
}
